<!DOCTYPE html>
<html>

<head>
   <meta charset="UTF-8">
   <meta name="renderer" content="webkit">
   <title>首页 - 道路运输从业人员安全学习监管平台</title>
   <!-- import CSS -->
   <link rel="stylesheet" href="/style/default/index.css">
   <link rel="stylesheet" href="/style/default/my.css">
   <link rel="stylesheet" href="http://cdn.jsdelivr.net/npm/v-charts/lib/style.min.css">
   <style>
      .btn_cls {
         padding: 15px 10px 10px 10px;
         width: 90%;
         font-size: 1.1rem;
      }

      .btn_cls i {
         font-size: 2.0rem;
         height: 3rem;
      }

      .btn_cls2 {
         padding: 15px 10px 10px 10px;
         width: 90%;
         text-align: left;
      }

      .btn_cls2 span {
         font-size: 1.2rem;
         height: 3rem;
      }

      .btn_cls2 div {
         font-size: 0.9rem;
         text-align: right;
      }
   </style>
</head>

<body style="background-color:#f8f8f8;margin: 20px;">
   <div id="app">

      <div v-show="dataLoading" style="text-align: center;padding-top: 100px;">
         <span style="font-size: 2rem;"><i class="el-icon-loading"></i> 获取数据中....</span>
      </div>

      <div v-show="!dataLoading" style="padding: 20px;">
         <el-form ref="itemForm" :model="itemData" label-width="140px" size="mini"
            style="margin-right: 30px;">
            <el-col :span="16">
               <el-col :span="12">
                  <el-form-item label="名称">
                     <el-input v-model="itemData.name" disabled></el-input>
                  </el-form-item>
               </el-col>
               <el-col :span="12">
                  <el-form-item label="真实姓名">
                     <el-input v-model="itemData.real_name" disabled></el-input>
                  </el-form-item>
               </el-col>
               <el-col :span="12">
                  <el-form-item label="手机号码">
                     <el-input v-model="itemData.phone" disabled></el-input>
                  </el-form-item>
               </el-col>
               <el-col :span="12">
                  <el-form-item label="身份证号">
                     <el-input v-model="itemData.idcard" disabled></el-input>
                  </el-form-item>
               </el-col>
               <el-col :span="12">
                  <el-form-item label="所属单位">
                     <el-input v-model="itemData.idcard" disabled></el-input>
                  </el-form-item> 
               </el-col>
               <el-col :span="12">
                  <el-form-item label="文化程度">
                     <el-input v-model="itemData.education" disabled></el-input>
                  </el-form-item>
               </el-col>
               <el-col :span="12">
                  <el-form-item label="性别">
                     <el-input v-model="itemData.sex" disabled></el-input>
                  </el-form-item> 
               </el-col>
               <el-col :span="12">
                  <el-form-item label="民族">
                     <el-input v-model="itemData.nation" disabled></el-input>
                  </el-form-item>
               </el-col>
               <el-col :span="12">
                  <el-form-item label="出生日期">
                     <el-input v-model="itemData.birthday" disabled></el-input>
                  </el-form-item>
               </el-col>
               <el-col :span="12">
                  <el-form-item label="籍贯">
                     <el-input v-model="itemData.resident" disabled></el-input>
                  </el-form-item>
               </el-col>
               <el-col :span="12">
                  <el-form-item label="驾驶证到期时间">
                     <el-input v-model="itemData.driver_license_end" disabled></el-input>
                  </el-form-item> 
               </el-col>
               <el-col :span="12">
                  <el-form-item label="资格证到期时间">
                     <el-input v-model="itemData.qualification_end" disabled></el-input>
                  </el-form-item>
               </el-col>
               <el-col :span="12">
                  <el-form-item label="最后登录时间">
                     <el-input v-model="itemData.driver_license_end" disabled></el-input>
                  </el-form-item> 
               </el-col>
               <el-col :span="12">
                  <el-form-item label="最后学习时间">
                     <el-input v-model="itemData.qualification_end" disabled></el-input>
                  </el-form-item>
               </el-col>
            </el-col>
            <el-col :span="8" style="text-align: center;">
               <el-image style="width: 240px; height: 320px" :src="itemData.photo" fit="scale-down">
                  <div slot="error" class="image-slot">
                     <el-image style="width: 240px; height: 320px" src="/images/student_bg.png" fit="scale-down">
                     </el-image>
                  </div>
               </el-image>
            </el-col>  
             
         </el-form>
      </div>


   </div>
</body>
<script src="http://cdn.staticfile.org/vue/2.6.10/vue.min.js"></script>
<script src="http://cdn.staticfile.org/element-ui/2.12.0/index.js"></script>
<script src="http://cdn.staticfile.org/axios/0.19.0/axios.min.js"></script>
<script src="http://cdn.jsdelivr.net/npm/echarts/dist/echarts.min.js"></script>
<script src="http://cdn.jsdelivr.net/npm/v-charts/lib/index.min.js"></script>
<script src="/js/validate.js"></script>
<script src="/js/my_util.js?t=29348"></script>

<script>
   var vm = new Vue({
      el: '#app',
      data: function () {
         return {
            tagHeight: window.innerHeight / 5, // 表格高，当窗口改变大小的时候通过 pageResize 修改该值
            dataLoading: false,     // 显示登录等待中
            itemData: {},           // 条目数据

         }
      },
      mounted() {
         // 当窗口大小发生改变的时候系统自动调用
         window.onresize = () => {
            this.pageResize();
         }
      },
      methods: {
         // 改变表格高度
         pageResize() {
            this.tagHeight = window.innerHeight / 5;
         },

      },
   });

   // 给父级页面调用的方法
   function loadTableDataToCallback(id) {
      vm.dataLoading = true; 
      if (id > 0) {
         // 通过ID读取课件信息
         axios.get('/admin/base/' + id + '/show/student_info!id.bu')
            .then(function (response) {
               if (response.data.code > 0) {
                  vm.itemData = response.data.bundle;
               } else if (response.data.code == 0) {
                  vm.$message.error("没有数据");
               } else {
                  vm.$message.error(response.data.msg);
               }
               vm.dataLoading = false;
            })
            .catch(function (error) {
               vm.$message.error('获取数据失败！' + error);
               vm.dataLoading = false;
            });
      } else {
         vm.$message.error('打开失败，错误的参数ID！');
         vm.dataLoading = false;
      }
   }

   // 自动执行，读取表格数据等
   function loadInitData() {


   } 
   
   loadInitData();

</script>

</html>